<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>蜗牛图书商城</title>
</head>
<body>
	<!-- 标题栏 -->
	<jsp:include page="header.jsp"></jsp:include>

	<!-- 展示 -->
	<div class="col-md-10 col-md-push-1">
		<div class="col-md-12 bg-danger text-left" style="margin-bottom: 10px">
			<div class="col-md-6 text-left">
				<h3>订单详情</h3>
			</div>
			<div class="col-md-6 text-right">
				<button class="btn btn-lg btn-primary" onclick="goBack()"
					style="height: 56px">返回</button>
			</div>
		</div>
		<div style="height: 630px;">
			<div class="col-md-12 bg-warning text-center" id="cartView">
				<div class="col-md-12 text-center panel" id="view"
					style="margin-top: 10px">
					<!-- 展示操作路径 -->
					<div class="panel-heading text-left">
						<a href="index.jsp">商城首页</a>-><a href="MyOrderForm.jsp">订单管理</a>-><a
							href="javascript:void(0)">订单详情</a>
					</div>
					<!-- 面板主体 -->
					<div class="panel-body">
						<!-- 表格 -->
						<table class="table">
							<tr>
								<td style="vertical-align: middle">订单号：${orderForm.ono}</td>
								<td style="vertical-align: middle">下单时间：${orderForm.odate}</td>
								<td style="vertical-align: middle">订单状态： <c:if
										test="${orderForm.ostate==2}">已提交未付款</c:if> <c:if
										test="${orderForm.ostate==3}">已付款未发货</c:if> <c:if
										test="${orderForm.ostate==4}">已发货未收货</c:if> <c:if
										test="${orderForm.ostate==5}">订单完成</c:if>
								</td>
							</tr>
							<tr>
								<td colspan="4">${orderForm.ainfo.replaceAll("-","")}（邮编:${orderForm.acode}）&nbsp;${orderForm.aname}（tel:${orderForm.aphone}）&nbsp;<strong>收</strong></td>
							</tr>
							<tr>
								<td colspan="4"></td>
							</tr>
						</table>
						<!-- 订单详情表 -->
						<table class="table table-bordered table-hover table-striped">
							<caption>订单详情：</caption>
							<!-- 表头 -->
							<thead>
								<tr>
									<th class="text-center" style="vertical-align: middle">序号</th>
									<th class="text-center" style="vertical-align: middle">商品名称</th>
									<th class="text-center" style="vertical-align: middle">商品价格</th>
									<th class="text-center" style="vertical-align: middle">商品数量</th>
									<th class="text-center" style="vertical-align: middle">商品图片</th>
								</tr>
							</thead>
							<!-- 表格主体 -->
							<tbody id="cartTB">
								<c:forEach items="${list}" var="orderInfo" varStatus="status">
									<tr>
										<td style="vertical-align: middle">${status.count}</td>
										<td style="vertical-align: middle"><a
											href="goods?opr=initGoodsInfo&gid=${orderInfo.gid}">${orderInfo.gname}</a></td>
										<td style="vertical-align: middle">￥<span
											id="gprice_${orderInfo.oiid}">${orderInfo.oiprice}</span></td>
										<td style="vertical-align: middle; width: 140px">${orderInfo.oinum}
										</td>
										<td style="vertical-align: middle"><a
											href="goods?opr=initGoodsInfo&gid=${orderInfo.gid}"> <img
												src="${orderInfo.gpic}" style='height: 60px' />
										</a></td>
									</tr>
								</c:forEach>
							</tbody>
							<tfoot id="cartTF">
								<tr>
									<th colspan="5" style="vertical-align: middle">订单总价为：<font
										id="totalPrice" size="6" color="red">${totalPrice}</font>元
									</th>
								</tr>
							</tfoot>
						</table>
					</div>
					<!-- 新增按钮 -->
					<div class="panel-footer" style="height: 50px"></div>
				</div>
			</div>
			<div class="col-md-12 bg-success text-center" id="pageNav"></div>
			<div class='col-md-12 bg-warning' style="height: 50px;"></div>
		</div>
	</div>
	<!-- 版权页 -->
	<jsp:include page="footer.jsp"></jsp:include>
</body>
<script type="text/javascript">
	$(document).ready(function() {
		if ("${loginUser.ucartid}" == "" || "${loginUser.ucartid}" == 0) {
			alert("请登录商城用户账号！");
			location.href = "index.jsp";
		}
	})

	//返回
	function goBack() {
		history.go(-1);
	}
</script>
</html>